﻿@{
    ViewBag.Title = "DOMChanged";
}

<h2>Dynamically DOM changes</h2>
<p>
    Press buttons to update the src attribute of the image:
</p>

<img id="SampleImage" src="~/Content/images/Circles.png" style="width: 100%" />
<br />
<script language="javascript">
    function changeImage(name) {
        var sampleImage=document.getElementById("SampleImage");
        sampleImage.src = '@Url.Content("~/Content/images/")' + name;
    }
</script>
<input id="CirclesButton" type="button" value="Set Circles" onclick="changeImage('Circles.png')"/>
<input id="PentagonsButton" type="button" value="Set Pentagons" onclick="changeImage('Pentagons.png')" />
<input id="RectanglesButton" type="button" value="Set Rectangles" onclick="changeImage('Rectangles.png')" />